import Vue from "vue";
import App from "./App.vue";
// import ElementUI from "element-ui";
// import "element-ui/lib/theme-chalk/index.css";
// Vue.use(ElementUI);
import router from "./router";
import store from "@/store/index";
import "@/permission";
import echarts from "echarts";
import "./assets/iconfont/iconfont.css";
import "element-ui/lib/theme-chalk/index.css";
import "quill/dist/quill.core.css";
import "quill/dist/quill.snow.css";
import "quill/dist/quill.bubble.css";
import "./assets/css/commonele.scss";
import "./assets/css/common.scss";
import "./assets/css/index.scss";
import "./assets/css/rich_text.scss";
import "./assets/css/notebook.scss"
//自定义指令
import '@/utils/directive';
import './assets/js/flexible.js'
Vue.config.devtools = true;

Vue.config.productionTip = false;
// 上传的音频图片的地址
Vue.prototype.assetsURL = process.env.VUE_APP_BASE_URL;
// 静态资源的地址（音频）
// Vue.prototype.baseURL = "https://66.zhihui11.com/";
Vue.prototype.baseURL = process.env.VUE_APP_BASE_URL;
Vue.prototype.baseAPI = process.env.VUE_APP_BASE_API;
// Vue.prototype.baseAPI = "http://192.168.119.10:8101/";
Vue.prototype.$echarts = echarts;
Vue.prototype.$bus = new Vue();
import $moment from "moment";
$moment.locale("zh-cn", {
  relativeTime: {
    future: "%s内",
    past: "%s前",
    s: "几秒",
    ss: "%d秒",
    m: "1分钟",
    mm: "%d分钟",
    h: "1小时",
    hh: "%d小时",
    d: "1天",
    dd: "%d天",
    M: "1个月",
    MM: "%d个月",
    y: "1年",
    yy: "%d年",
  },
});
Vue.prototype.$moment = $moment;
// 数据处理loadsh
import _ from "lodash";
Vue.prototype._ = _;
// websocket
import { socket } from "./assets/js/supervise_ws";
Vue.prototype.$socket = socket;
// 打印
import PrintJS from "./assets/js/print";
Vue.use(PrintJS);
// 录音
import Recorder from "js-audio-recorder";
Vue.prototype.$Recorder = Recorder;

const lamejs = require("lamejs");
Vue.prototype.$lamejs = lamejs;

import plugins from "./plugins";
Vue.use(plugins);

import {
  Drawer,
  Pagination,
  Dialog,
  Autocomplete,
  Dropdown,
  DropdownMenu,
  DropdownItem,
  Menu,
  Submenu,
  MenuItem,
  MenuItemGroup,
  Input,
  InputNumber,
  Radio,
  RadioGroup,
  RadioButton,
  Checkbox,
  CheckboxButton,
  CheckboxGroup,
  Switch,
  Select,
  Option,
  OptionGroup,
  Button,
  ButtonGroup,
  Table,
  TableColumn,
  DatePicker,
  TimeSelect,
  TimePicker,
  Popover,
  Tooltip,
  Breadcrumb,
  BreadcrumbItem,
  Form,
  FormItem,
  Tabs,
  TabPane,
  Tag,
  Tree,
  Alert,
  Slider,
  Icon,
  Row,
  Col,
  Upload,
  Progress,
  Spinner,
  Badge,
  Card,
  Rate,
  Steps,
  Step,
  Carousel,
  CarouselItem,
  Collapse,
  CollapseItem,
  Cascader,
  ColorPicker,
  Transfer,
  Container,
  Header,
  Aside,
  Main,
  Footer,
  Timeline,
  TimelineItem,
  Link,
  Divider,
  Image,
  Calendar,
  Backtop,
  PageHeader,
  CascaderPanel,
  Loading,
  MessageBox,
  Message,
  Notification,
  Avatar,
} from "element-ui";
DatePicker.props.editable = false
Vue.use(Drawer);
Vue.use(Avatar);
Vue.use(Pagination);
Vue.use(Dialog);
Vue.use(Autocomplete);
Vue.use(Dropdown);
Vue.use(DropdownMenu);
Vue.use(DropdownItem);
Vue.use(Menu);
Vue.use(Submenu);
Vue.use(MenuItem);
Vue.use(MenuItemGroup);
Vue.use(Input);
Vue.use(InputNumber);
Vue.use(Radio);
Vue.use(RadioGroup);
Vue.use(RadioButton);
Vue.use(Checkbox);
Vue.use(CheckboxButton);
Vue.use(CheckboxGroup);
Vue.use(Switch);
Vue.use(Select);
Vue.use(Option);
Vue.use(OptionGroup);
Vue.use(Button);
Vue.use(ButtonGroup);
Vue.use(Table);
Vue.use(TableColumn);
Vue.use(DatePicker);
Vue.use(TimeSelect);
Vue.use(TimePicker);
Vue.use(Popover);
Vue.use(Tooltip);
Vue.use(Breadcrumb);
Vue.use(BreadcrumbItem);
Vue.use(Form);
Vue.use(FormItem);
Vue.use(Tabs);
Vue.use(TabPane);
Vue.use(Tag);
Vue.use(Tree);
Vue.use(Alert);
Vue.use(Slider);
Vue.use(Icon);
Vue.use(Row);
Vue.use(Col);
Vue.use(Upload);
Vue.use(Progress);
Vue.use(Spinner);
Vue.use(Badge);
Vue.use(Card);
Vue.use(Rate);
Vue.use(Steps);
Vue.use(Step);
Vue.use(Carousel);
Vue.use(CarouselItem);
Vue.use(Collapse);
Vue.use(CollapseItem);
Vue.use(Cascader);
Vue.use(ColorPicker);
Vue.use(Transfer);
Vue.use(Container);
Vue.use(Header);
Vue.use(Aside);
Vue.use(Main);
Vue.use(Footer);
Vue.use(Timeline);
Vue.use(TimelineItem);
Vue.use(Link);
Vue.use(Divider);
Vue.use(Image);
Vue.use(Calendar);
Vue.use(Backtop);
Vue.use(PageHeader);
Vue.use(CascaderPanel);

Vue.use(Loading.directive);
// 处理平板的键盘弹出问题
DatePicker._Ctor["0"].options.created.push(function () {
  this.$on("focus", () => {
      if (this["init" + this._uid]) {
          return
      }
      this["init" + this._uid] = true
      setTimeout(() => {
          const inputs =document.querySelector(".el-input--small > .el-input__inner[type='text']")
          if (inputs && inputs.length) {
              inputs.each((idx, item) => {
                  if (item.bound) {
                      return
                  }
                  item.bound = true
                  item.addEventListener("focus", (ev) => {
                      ev.target.blur()
                  })
              })
          }
      }, 100)
  })

})

Vue.prototype.$loading = Loading.service;
Vue.prototype.$msgbox = MessageBox;
Vue.prototype.$alert = MessageBox.alert;
Vue.prototype.$confirm = MessageBox.confirm;
Vue.prototype.$prompt = MessageBox.prompt;
Vue.prototype.$notify = Notification;
Vue.prototype.$message = Message;
import CollapseTransition from "element-ui/lib/transitions/collapse-transition";
Vue.component(CollapseTransition.name, CollapseTransition);
Vue.filter("filterTime", function(val, type, maxTime) {
  if (!val) {
    if (maxTime == "m") {
      return "00:00";
    } else {
      return "00:00:00";
    }
  }
  maxTime = maxTime || "h";
  let hours = "00",
    minutes = "00",
    seconds = "00";
  if (maxTime == "h") {
    hours = parseInt(val / 3600);
    if (hours < 10) {
      hours = "0" + hours;
    }
    minutes = parseInt((val % 3600) / 60);
    if (minutes < 10) {
      minutes = "0" + minutes;
    }
  } else if (maxTime == "m") {
    minutes = parseInt(val / 60);
    if (minutes < 10) {
      minutes = "0" + minutes;
    }
  }
  seconds = parseInt(val % 60);
  if (seconds < 10) {
    seconds = "0" + seconds;
  }
  if (type == 1) {
    return (
      (hours !== "00" ? hours + "时" : "") +
      (minutes !== "00" ? minutes + "分" : "") +
      (seconds !== "00" ? seconds + "秒" : "0秒")
    );
  }
  return (maxTime == "m" ? "" : hours + ":") + minutes + ":" + seconds;
});
Vue.directive("focus", {
  // 当被绑定的元素插入到 DOM 中时……
  inserted: function(el) {
    // 聚焦元素
    el.focus();
  },
});
Vue.directive("hidden-opacity", function(dom, data) {
  if (data.value) {
    dom.style.opacity = "inherit";
  } else {
    dom.style.opacity = 0;
  }
});
Vue.directive("hidden-opat", {
  // 当被绑定的元素插入到 DOM 中时……
  inserted: function(el) {
    // 聚焦元素
    el.focus();
  },
});
import { isBroswer, isMobile } from "./assets/js/brower";
Vue.prototype.$checkBrower = function() {
  if (!sessionStorage.getItem("isUpgrade") && !isMobile) {
    let browerInfo = isBroswer();
    if (browerInfo.chrome && browerInfo.version < 80) {
      // 提示升级浏览器
      // Message({
      //   message: "你的浏览器版本太低了，为了达到最佳的浏览效果，请更新浏览器",
      //   type: "warning",
      //   duration: 5000,
      //   showClose: true,
      //   customClass: "brower-reminder",
      // });
      this.$confirm(
        `你的浏览器版本太低了，为了达到最佳的浏览效果，
        请尽快更新浏览器，是否前往下载浏览器`,
        "提示",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          closeOnClickModal: false,
          closeOnPressEscape: false,
        }
      )
        .then(() => {
          window.location.href = this.baseURL;
        })
        .catch(() => {
          return false;
        });
    }
    if (!browerInfo.chrome) {
      // 不是谷歌
      // Message({
      //   message:
      //     "你的浏览器不是谷歌浏览器，为了不影响正常使用，请下载新版谷歌浏览器",
      //   type: "warning",
      //   duration: 5000,
      //   showClose: true,
      //   customClass: "brower-reminder",
      // });
      this.$confirm(
        `你的浏览器不是谷歌浏览器，为了不影响正常使用，请下载新版谷歌浏览器，是否前往下载浏览器`,
        "提示",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          closeOnClickModal: false,
          closeOnPressEscape: false,
        }
      )
        .then(() => {
          window.location.href = this.baseURL;
        })
        .catch(() => {
          return false;
        });
    }
    // sessionStorage.setItem("isUpgrade", 1);
  }
};
Vue.prototype.$pauseAllAudio = function() {
  let audioList = document.getElementsByTagName("audio");
  Array.from(audioList).forEach((audio) => {
    audio.currentTime = 0;
    audio.pause();
  });
};
Vue.prototype.$pauseAllVideo = function() {
  let vidioList = document.getElementsByTagName("video");
  Array.from(vidioList).forEach((video) => {
    video.pause();
  });
};

Vue.prototype.$beforeConfirmClose = function(action, instance, done) {
  if (action == "confirm") {
    instance.$refs["confirm"].$el.onclick = ((e) => {
      e = e || window.event;
      if (e.detail != 0) {
        done();
      }
    })();
  } else {
    done();
  }
};
Vue.prototype.$removeHtmlStyle = function(html) {
  var rel = /style\s*?=\s*?([‘"])[\s\S]*?\1/;
  var newHtml = "";
  if (html) {
    newHtml = html.replace(rel, "");
  }
  return newHtml;
};
Vue.prototype.$handlePaste = function() {
  return;
};
Vue.prototype.$goRouter = function(routeName, query) {
  router.push({
    name: routeName,
    query,
  });
};
Vue.prototype.$randomArr = function(arr) {
  // return arr.sort(function() {
  //   return Math.random() > 0.5 ? 1 : -1;
  // });
  return this._.shuffle(arr);
};
Vue.prototype.$phoneme2phonetic = function(phoneme) {
  let searchData = store.getters.phoneme.filter((item) => {
    return item.lable == phoneme || item.lable.replace(" ", "") == phoneme;
  });
  if (searchData.length > 0) {
    return store.getters.isBritish == 1 ? searchData[0].UK : searchData[0].US;
  }
  return "";
};
//时间格式化

/**
 *  获取麦克风权限
 * */
(Vue.prototype.$getPermission = function() {
  Vue.prototype.$Recorder.getPermission().then(
    () => {
      console.log("获取权限成功");
    },
    (error) => {
      console.log(`${error.name} : ${error.message}`);
      if (error.name == "NotAllowedError") {
        Vue.prototype.$message({
          type: "error",
          message: `没有使用麦克风的权限`,
        });
      } else if (
        error.name == "NotFoundError" &&
        error.message == "Requested device not found"
      ) {
        Vue.prototype.$message({
          type: "error",
          message: `没有找到麦克风`,
        });
      } else {
        Vue.prototype.$message({
          type: "error",
          message: `${error.name} : ${error.message}`,
        });
      }
    }
  );
}),
  router.beforeEach((to, from, next) => {
    // console.log(to, from);
    /* 路由发生变化修改页面meta */
    // if (to.meta.content) {
    //   let head = document.getElementsByTagName("head");
    //   let meta = document.createElement("meta");
    //   meta.content = to.meta.content;
    //   head[0].appendChild(meta);
    // }
    /* 路由发生变化修改页面title */
    if (to.matched && to.matched.length >= 2 && to.name != "studyIndex") {
      if (to.matched[1].meta && to.matched[1].meta.title) {
        document.title = "智慧1+1-" + to.matched[1].meta.title;
      } else {
        document.title = "智慧1+1";
      }
    } else {
      document.title = "智慧1+1";
    }
    Vue.prototype.$checkBrower();
    next();
  });
new Vue({
  router,
  store,
  render: (h) => h(App),
}).$mount("#app");
